/* Modal Windows */


.modal-overlay {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	display: none;
	z-index: 999998;
	background-position: 0 0;
	background-repeat: repeat;
	background-image: url();

	.modal {
		width: 500px;
		margin-left: auto;
		margin-right: auto;
		z-index: 999999;
		position: absolute;
		color: $modal-fg;
		display: none;
		box-shadow: 0 0 5px $box-shadow;

		&> header {
			background-image: $modal-header-bg;
			color: $modal-header-fg;
			font-size: 18px;
			padding: 4px 10px;
			text-align: left;
			text-transform: uppercase;
		}

		&> section {
			background-color: $modal-section-bg;
			border-bottom: 1px solid $border;
			min-height: 50px;
			padding: 20px;
			text-align: left;
		}

		&> footer {
			background-color: $modal-footer-bg;
			padding: 10px;
		}

		.btn {
			border-radius: 3px;
			padding: 4px 10px;
			color: $modal-btn-fg !important;
			text-transform: uppercase;
			text-align: center;
			font-size: 14px;
			display: inline-block;
			border: 1px solid $btn-border;
			background-image: $btn-bg;
			color: $btn-fg;
		}

		.btn:hover {
			border: 1px solid $btn-border-hover;
			background-image: $btn-bg-hover;
			color: $btn-fg;
		}
	}
}
